<template>
	<view class="home__container__item u-f-ac" @tap="send">
		<view class="home__container__item--icon">
			<slot/>
		</view>
		
		<text class="home__container__item--title">{{title}}</text>
		<text class="icon iconfont icon-arrow-down-s-line home__container__item--last"></text>
	</view>
</template>

<script setup>
	const props = defineProps({
		title:{
			type:String,
			default:"",
		},
		clicktype:{
			type:String,
			default:"navigateTo",
		},
		url:{
			type:String,
			default:"",
		}
	})
	
	
	function send(e){
		if(props.url=="")return;
		switch(props.clicktype){
			case "navigateTo":
				uni.navigateTo({url:props.url})
				break;
		}
	}
	
</script>

<style scoped lang="scss">
.home__container__item {
	justify-content: space-between;
	width: 100%;
	padding: 30upx 10upx;
	border-bottom: 1upx solid #f5f5f5;
	&--icon {
		padding: 10upx 20upx;
		color: #0984e3;
		
	}
	&--title {
		font-size: 35upx;
		flex: 1;
		text-align: left;
		color: rgba(0, 0, 0, 1);
	}
	&--last{
		display: inline-block;
		transform: rotate(-90deg);
		padding: 10upx 20upx;
		font-size: 50upx;
		color: #ccc;
	}
}
</style>
